<script setup lang="ts">
import { ref } from "vue";
import VulnerabilityQuery from "./VulnerabilityQuery.vue";
import ScanHistory from "./ScanHistory.vue";

const props = defineProps<{
  task: string;
}>();

const activeTab = ref("vulnerabilities");
const scanHistoryRef = ref<any>(null);

// 监听扫描完成，刷新历史
const handleScanComplete = () => {
  if (scanHistoryRef.value) {
    scanHistoryRef.value.fetchScanHistory();
  }
};

const handleTabChange = (tab: string) => {
  activeTab.value = tab;
  if (tab === "history" && scanHistoryRef.value) {
    scanHistoryRef.value.fetchScanHistory();
  }
};
</script>

<template>
  <div>
    <el-tabs
      v-model="activeTab"
      @tab-change="handleTabChange"
      type="border-card"
    >
      <!-- 漏洞库查询 -->
      <el-tab-pane label="漏洞库查询" name="vulnerabilities">
        <VulnerabilityQuery :task="task" @scan-complete="handleScanComplete" />
      </el-tab-pane>

      <!-- 扫描历史 -->
      <el-tab-pane label="扫描历史" name="history">
        <ScanHistory ref="scanHistoryRef" :task="task" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<style scoped lang="scss"></style>
